
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>IconFont</title>
    <link rel="stylesheet" href="demo.css">
    <link rel="stylesheet" href="iconfont.css">
</head>
<body>
    <div class="main markdown">
        <h1>IconFont 图标</h1>
        <ul class="icon_lists clear">
            
                <li>
                <i class="icon miuu u-awlt"></i>
                    <div class="name">arrow_02_left_2</div>
                    <div class="fontclass">.u-awlt</div>
                </li>
            
                <li>
                <i class="icon miuu u-arrowleft"></i>
                    <div class="name">arrow_02_left</div>
                    <div class="fontclass">.u-arrowleft</div>
                </li>
            
                <li>
                <i class="icon miuu u-awlf"></i>
                    <div class="name">arrow_02_right_2</div>
                    <div class="fontclass">.u-awlf</div>
                </li>
            
                <li>
                <i class="icon miuu u-arrowrt"></i>
                    <div class="name">arrow_02_right</div>
                    <div class="fontclass">.u-arrowrt</div>
                </li>
            
                <li>
                <i class="icon miuu u-ordersearch"></i>
                    <div class="name">order_search</div>
                    <div class="fontclass">.u-ordersearch</div>
                </li>
            
                <li>
                <i class="icon miuu u-display"></i>
                    <div class="name">display</div>
                    <div class="fontclass">.u-display</div>
                </li>
            
                <li>
                <i class="icon miuu u-notification"></i>
                    <div class="name">notification</div>
                    <div class="fontclass">.u-notification</div>
                </li>
            
                <li>
                <i class="icon miuu u-all"></i>
                    <div class="name">all</div>
                    <div class="fontclass">.u-all</div>
                </li>
            
                <li>
                <i class="icon miuu u-back"></i>
                    <div class="name">back</div>
                    <div class="fontclass">.u-back</div>
                </li>
            
                <li>
                <i class="icon miuu u-cart"></i>
                    <div class="name">cart</div>
                    <div class="fontclass">.u-cart</div>
                </li>
            
                <li>
                <i class="icon miuu u-category"></i>
                    <div class="name">Category</div>
                    <div class="fontclass">.u-category</div>
                </li>
            
                <li>
                <i class="icon miuu u-close"></i>
                    <div class="name">close</div>
                    <div class="fontclass">.u-close</div>
                </li>
            
                <li>
                <i class="icon miuu u-comments"></i>
                    <div class="name">comments</div>
                    <div class="fontclass">.u-comments</div>
                </li>
            
                <li>
                <i class="icon miuu u-cry"></i>
                    <div class="name">cry</div>
                    <div class="fontclass">.u-cry</div>
                </li>
            
                <li>
                <i class="icon miuu u-delete"></i>
                    <div class="name">delete</div>
                    <div class="fontclass">.u-delete</div>
                </li>
            
                <li>
                <i class="icon miuu u-edit"></i>
                    <div class="name">edit</div>
                    <div class="fontclass">.u-edit</div>
                </li>
            
                <li>
                <i class="icon miuu u-email"></i>
                    <div class="name">email</div>
                    <div class="fontclass">.u-email</div>
                </li>
            
                <li>
                <i class="icon miuu u-favorite"></i>
                    <div class="name">favorite</div>
                    <div class="fontclass">.u-favorite</div>
                </li>
            
                <li>
                <i class="icon miuu u-form"></i>
                    <div class="name">form</div>
                    <div class="fontclass">.u-form</div>
                </li>
            
                <li>
                <i class="icon miuu u-help"></i>
                    <div class="name">help</div>
                    <div class="fontclass">.u-help</div>
                </li>
            
                <li>
                <i class="icon miuu u-information"></i>
                    <div class="name">information</div>
                    <div class="fontclass">.u-information</div>
                </li>
            
                <li>
                <i class="icon miuu u-less"></i>
                    <div class="name">less</div>
                    <div class="fontclass">.u-less</div>
                </li>
            
                <li>
                <i class="icon miuu u-moreunfold"></i>
                    <div class="name">more_unfold</div>
                    <div class="fontclass">.u-moreunfold</div>
                </li>
            
                <li>
                <i class="icon miuu u-more"></i>
                    <div class="name">more</div>
                    <div class="fontclass">.u-more</div>
                </li>
            
                <li>
                <i class="icon miuu u-pic"></i>
                    <div class="name">pic</div>
                    <div class="fontclass">.u-pic</div>
                </li>
            
                <li>
                <i class="icon miuu u-qrcode"></i>
                    <div class="name">QRCode</div>
                    <div class="fontclass">.u-qrcode</div>
                </li>
            
                <li>
                <i class="icon miuu u-refresh"></i>
                    <div class="name">refresh</div>
                    <div class="fontclass">.u-refresh</div>
                </li>
            
                <li>
                <i class="icon miuu u-rfq"></i>
                    <div class="name">RFQ</div>
                    <div class="fontclass">.u-rfq</div>
                </li>
            
                <li>
                <i class="icon miuu u-search1"></i>
                    <div class="name">search</div>
                    <div class="fontclass">.u-search1</div>
                </li>
            
                <li>
                <i class="icon miuu u-selected"></i>
                    <div class="name">selected</div>
                    <div class="fontclass">.u-selected</div>
                </li>
            
                <li>
                <i class="icon miuu u-set"></i>
                    <div class="name">set</div>
                    <div class="fontclass">.u-set</div>
                </li>
            
                <li>
                <i class="icon miuu u-smile"></i>
                    <div class="name">Smile</div>
                    <div class="fontclass">.u-smile</div>
                </li>
            
                <li>
                <i class="icon miuu u-success"></i>
                    <div class="name">success</div>
                    <div class="fontclass">.u-success</div>
                </li>
            
                <li>
                <i class="icon miuu u-survey"></i>
                    <div class="name">survey</div>
                    <div class="fontclass">.u-survey</div>
                </li>
            
                <li>
                <i class="icon miuu u-training"></i>
                    <div class="name">training</div>
                    <div class="fontclass">.u-training</div>
                </li>
            
                <li>
                <i class="icon miuu u-viewgallery"></i>
                    <div class="name">ViewGallery</div>
                    <div class="fontclass">.u-viewgallery</div>
                </li>
            
                <li>
                <i class="icon miuu u-viewlist"></i>
                    <div class="name">Viewlist</div>
                    <div class="fontclass">.u-viewlist</div>
                </li>
            
                <li>
                <i class="icon miuu u-warning"></i>
                    <div class="name">warning</div>
                    <div class="fontclass">.u-warning</div>
                </li>
            
                <li>
                <i class="icon miuu u-wrong"></i>
                    <div class="name">wrong</div>
                    <div class="fontclass">.u-wrong</div>
                </li>
            
                <li>
                <i class="icon miuu u-account"></i>
                    <div class="name">account</div>
                    <div class="fontclass">.u-account</div>
                </li>
            
                <li>
                <i class="icon miuu u-add"></i>
                    <div class="name">add</div>
                    <div class="fontclass">.u-add</div>
                </li>
            
                <li>
                <i class="icon miuu u-atm"></i>
                    <div class="name">atm</div>
                    <div class="fontclass">.u-atm</div>
                </li>
            
                <li>
                <i class="icon miuu u-clock"></i>
                    <div class="name">clock</div>
                    <div class="fontclass">.u-clock</div>
                </li>
            
                <li>
                <i class="icon miuu u-remind"></i>
                    <div class="name">remind</div>
                    <div class="fontclass">.u-remind</div>
                </li>
            
                <li>
                <i class="icon miuu u-dianhua"></i>
                    <div class="name">电话</div>
                    <div class="fontclass">.u-dianhua</div>
                </li>
            
                <li>
                <i class="icon miuu u-mima"></i>
                    <div class="name">密码</div>
                    <div class="fontclass">.u-mima</div>
                </li>
            
                <li>
                <i class="icon miuu u-qunzu"></i>
                    <div class="name">群组</div>
                    <div class="fontclass">.u-qunzu</div>
                </li>
            
                <li>
                <i class="icon miuu u-shanchu"></i>
                    <div class="name">删除</div>
                    <div class="fontclass">.u-shanchu</div>
                </li>
            
                <li>
                <i class="icon miuu u-shezhi"></i>
                    <div class="name">设置</div>
                    <div class="fontclass">.u-shezhi</div>
                </li>
            
                <li>
                <i class="icon miuu u-shengyin"></i>
                    <div class="name">声音</div>
                    <div class="fontclass">.u-shengyin</div>
                </li>
            
                <li>
                <i class="icon miuu u-shizhong"></i>
                    <div class="name">时钟</div>
                    <div class="fontclass">.u-shizhong</div>
                </li>
            
                <li>
                <i class="icon miuu u-shouye"></i>
                    <div class="name">首页</div>
                    <div class="fontclass">.u-shouye</div>
                </li>
            
                <li>
                <i class="icon miuu u-sousuo"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.u-sousuo</div>
                </li>
            
                <li>
                <i class="icon miuu u-tianjiayonghu"></i>
                    <div class="name">添加用户</div>
                    <div class="fontclass">.u-tianjiayonghu</div>
                </li>
            
                <li>
                <i class="icon miuu u-tongxunlu"></i>
                    <div class="name">通讯录</div>
                    <div class="fontclass">.u-tongxunlu</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiugai"></i>
                    <div class="name">修改</div>
                    <div class="fontclass">.u-xiugai</div>
                </li>
            
                <li>
                <i class="icon miuu u-yonghu"></i>
                    <div class="name">用户</div>
                    <div class="fontclass">.u-yonghu</div>
                </li>
            
                <li>
                <i class="icon miuu u-zan"></i>
                    <div class="name">赞</div>
                    <div class="fontclass">.u-zan</div>
                </li>
            
                <li>
                <i class="icon miuu u-duihuaxinxi"></i>
                    <div class="name">对话信息</div>
                    <div class="fontclass">.u-duihuaxinxi</div>
                </li>
            
                <li>
                <i class="icon miuu u-rili"></i>
                    <div class="name">日历</div>
                    <div class="fontclass">.u-rili</div>
                </li>
            
                <li>
                <i class="icon miuu u-shipin"></i>
                    <div class="name">视频</div>
                    <div class="fontclass">.u-shipin</div>
                </li>
            
                <li>
                <i class="icon miuu u-tupian"></i>
                    <div class="name">图片</div>
                    <div class="fontclass">.u-tupian</div>
                </li>
            
                <li>
                <i class="icon miuu u-xinfeng"></i>
                    <div class="name">信封</div>
                    <div class="fontclass">.u-xinfeng</div>
                </li>
            
                <li>
                <i class="icon miuu u-yinle"></i>
                    <div class="name">音乐</div>
                    <div class="fontclass">.u-yinle</div>
                </li>
            
                <li>
                <i class="icon miuu u-zuanshi"></i>
                    <div class="name">钻石</div>
                    <div class="fontclass">.u-zuanshi</div>
                </li>
            
                <li>
                <i class="icon miuu u-anquan"></i>
                    <div class="name">安全</div>
                    <div class="fontclass">.u-anquan</div>
                </li>
            
                <li>
                <i class="icon miuu u-bukaixin"></i>
                    <div class="name">不开心</div>
                    <div class="fontclass">.u-bukaixin</div>
                </li>
            
                <li>
                <i class="icon miuu u-dibiao"></i>
                    <div class="name">地标</div>
                    <div class="fontclass">.u-dibiao</div>
                </li>
            
                <li>
                <i class="icon miuu u-fenleiorguangchangorqita"></i>
                    <div class="name">分类or广场or其他</div>
                    <div class="fontclass">.u-fenleiorguangchangorqita</div>
                </li>
            
                <li>
                <i class="icon miuu u-fenxiang"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.u-fenxiang</div>
                </li>
            
                <li>
                <i class="icon miuu u-jiaxingshoucang"></i>
                    <div class="name">加星收藏</div>
                    <div class="fontclass">.u-jiaxingshoucang</div>
                </li>
            
                <li>
                <i class="icon miuu u-jinzhitishi"></i>
                    <div class="name">禁止提示</div>
                    <div class="fontclass">.u-jinzhitishi</div>
                </li>
            
                <li>
                <i class="icon miuu u-kaixin"></i>
                    <div class="name">开心</div>
                    <div class="fontclass">.u-kaixin</div>
                </li>
            
                <li>
                <i class="icon miuu u-liwu"></i>
                    <div class="name">礼物</div>
                    <div class="fontclass">.u-liwu</div>
                </li>
            
                <li>
                <i class="icon miuu u-qingdan"></i>
                    <div class="name">清单</div>
                    <div class="fontclass">.u-qingdan</div>
                </li>
            
                <li>
                <i class="icon miuu u-tianjia"></i>
                    <div class="name">添加</div>
                    <div class="fontclass">.u-tianjia</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiai"></i>
                    <div class="name">喜爱</div>
                    <div class="fontclass">.u-xiai</div>
                </li>
            
                <li>
                <i class="icon miuu u-zhengquetishi"></i>
                    <div class="name">正确提示</div>
                    <div class="fontclass">.u-zhengquetishi</div>
                </li>
            
                <li>
                <i class="icon miuu u-biaoqian"></i>
                    <div class="name">标签</div>
                    <div class="fontclass">.u-biaoqian</div>
                </li>
            
                <li>
                <i class="icon miuu u-chongzhi"></i>
                    <div class="name">充值</div>
                    <div class="fontclass">.u-chongzhi</div>
                </li>
            
                <li>
                <i class="icon miuu u-duigou"></i>
                    <div class="name">对勾</div>
                    <div class="fontclass">.u-duigou</div>
                </li>
            
                <li>
                <i class="icon miuu u-duihuan"></i>
                    <div class="name">兑换</div>
                    <div class="fontclass">.u-duihuan</div>
                </li>
            
                <li>
                <i class="icon miuu u-erweima"></i>
                    <div class="name">二维码</div>
                    <div class="fontclass">.u-erweima</div>
                </li>
            
                <li>
                <i class="icon miuu u-gengduo"></i>
                    <div class="name">更多</div>
                    <div class="fontclass">.u-gengduo</div>
                </li>
            
                <li>
                <i class="icon miuu u-guanbi"></i>
                    <div class="name">关闭</div>
                    <div class="fontclass">.u-guanbi</div>
                </li>
            
                <li>
                <i class="icon miuu u-jinbiduihuan"></i>
                    <div class="name">金币兑换</div>
                    <div class="fontclass">.u-jinbiduihuan</div>
                </li>
            
                <li>
                <i class="icon miuu u-saoyisao"></i>
                    <div class="name">扫一扫</div>
                    <div class="fontclass">.u-saoyisao</div>
                </li>
            
                <li>
                <i class="icon miuu u-shangchuan"></i>
                    <div class="name">上传</div>
                    <div class="fontclass">.u-shangchuan</div>
                </li>
            
                <li>
                <i class="icon miuu u-shuaxin"></i>
                    <div class="name">刷新</div>
                    <div class="fontclass">.u-shuaxin</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiazai"></i>
                    <div class="name">下载</div>
                    <div class="fontclass">.u-xiazai</div>
                </li>
            
                <li>
                <i class="icon miuu u-cuowutishi"></i>
                    <div class="name">错误提示</div>
                    <div class="fontclass">.u-cuowutishi</div>
                </li>
            
                <li>
                <i class="icon miuu u-anquantianchong"></i>
                    <div class="name">安全_填充</div>
                    <div class="fontclass">.u-anquantianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-cuowutishitianchong"></i>
                    <div class="name">错误提示_填充</div>
                    <div class="fontclass">.u-cuowutishitianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-dibiaotianchong"></i>
                    <div class="name">地标_填充</div>
                    <div class="fontclass">.u-dibiaotianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-dengdaitianchong"></i>
                    <div class="name">等待_填充</div>
                    <div class="fontclass">.u-dengdaitianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-duihuaxinxitianchong"></i>
                    <div class="name">对话信息_填充</div>
                    <div class="fontclass">.u-duihuaxinxitianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-faxiantianchong"></i>
                    <div class="name">发现_填充</div>
                    <div class="fontclass">.u-faxiantianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-fenleiorguangchangorqitatianchong"></i>
                    <div class="name">分类or广场or其他_填充</div>
                    <div class="fontclass">.u-fenleiorguangchangorqitatianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-fenxiangtianchong"></i>
                    <div class="name">分享_填充</div>
                    <div class="fontclass">.u-fenxiangtianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-gengduotianchong"></i>
                    <div class="name">更多_填充</div>
                    <div class="fontclass">.u-gengduotianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-jiaxingshoucangtianchong"></i>
                    <div class="name">加星收藏_填充</div>
                    <div class="fontclass">.u-jiaxingshoucangtianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-kaixintianchong"></i>
                    <div class="name">开心_填充</div>
                    <div class="fontclass">.u-kaixintianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-qunzutianchong"></i>
                    <div class="name">群组_填充</div>
                    <div class="fontclass">.u-qunzutianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-shanchutianchong"></i>
                    <div class="name">删除_填充</div>
                    <div class="fontclass">.u-shanchutianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-shezhitianchong"></i>
                    <div class="name">设置_填充</div>
                    <div class="fontclass">.u-shezhitianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-tixingtianchong"></i>
                    <div class="name">提醒_填充</div>
                    <div class="fontclass">.u-tixingtianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-tianjiatianchong"></i>
                    <div class="name">添加_填充</div>
                    <div class="fontclass">.u-tianjiatianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-addperson"></i>
                    <div class="name">添加用户_填充</div>
                    <div class="fontclass">.u-addperson</div>
                </li>
            
                <li>
                <i class="icon miuu u-heartfull"></i>
                    <div class="name">喜爱_填充</div>
                    <div class="fontclass">.u-heartfull</div>
                </li>
            
                <li>
                <i class="icon miuu u-messagehover"></i>
                    <div class="name">信封_填充</div>
                    <div class="fontclass">.u-messagehover</div>
                </li>
            
                <li>
                <i class="icon miuu u-repair"></i>
                    <div class="name">修改_填充</div>
                    <div class="fontclass">.u-repair</div>
                </li>
            
                <li>
                <i class="icon miuu u-yonghutianchong"></i>
                    <div class="name">用户_填充</div>
                    <div class="fontclass">.u-yonghutianchong</div>
                </li>
            
                <li>
                <i class="icon miuu u-assist"></i>
                    <div class="name">赞_填充</div>
                    <div class="fontclass">.u-assist</div>
                </li>
            
                <li>
                <i class="icon miuu u-inputselect"></i>
                    <div class="name">正确提示_填充</div>
                    <div class="fontclass">.u-inputselect</div>
                </li>
            
                <li>
                <i class="icon miuu u-calendar"></i>
                    <div class="name">calendar</div>
                    <div class="fontclass">.u-calendar</div>
                </li>
            
                <li>
                <i class="icon miuu u-shopcart"></i>
                    <div class="name">购物车</div>
                    <div class="fontclass">.u-shopcart</div>
                </li>
            
                <li>
                <i class="icon miuu u-attachment"></i>
                    <div class="name">attachment</div>
                    <div class="fontclass">.u-attachment</div>
                </li>
            
                <li>
                <i class="icon miuu u-discount"></i>
                    <div class="name">discount</div>
                    <div class="fontclass">.u-discount</div>
                </li>
            
                <li>
                <i class="icon miuu u-service"></i>
                    <div class="name">service</div>
                    <div class="fontclass">.u-service</div>
                </li>
            
                <li>
                <i class="icon miuu u-print"></i>
                    <div class="name">print</div>
                    <div class="fontclass">.u-print</div>
                </li>
            
                <li>
                <i class="icon miuu u-box"></i>
                    <div class="name">box</div>
                    <div class="fontclass">.u-box</div>
                </li>
            
                <li>
                <i class="icon miuu u-process"></i>
                    <div class="name">process</div>
                    <div class="fontclass">.u-process</div>
                </li>
            
                <li>
                <i class="icon miuu u-beauty"></i>
                    <div class="name">beauty</div>
                    <div class="fontclass">.u-beauty</div>
                </li>
            
                <li>
                <i class="icon miuu u-electrical"></i>
                    <div class="name">electrical</div>
                    <div class="fontclass">.u-electrical</div>
                </li>
            
                <li>
                <i class="icon miuu u-home"></i>
                    <div class="name">home</div>
                    <div class="fontclass">.u-home</div>
                </li>
            
                <li>
                <i class="icon miuu u-electronics"></i>
                    <div class="name">electronics</div>
                    <div class="fontclass">.u-electronics</div>
                </li>
            
                <li>
                <i class="icon miuu u-gifts"></i>
                    <div class="name">gifts</div>
                    <div class="fontclass">.u-gifts</div>
                </li>
            
                <li>
                <i class="icon miuu u-lights"></i>
                    <div class="name">lights</div>
                    <div class="fontclass">.u-lights</div>
                </li>
            
                <li>
                <i class="icon miuu u-sports"></i>
                    <div class="name">sports</div>
                    <div class="fontclass">.u-sports</div>
                </li>
            
                <li>
                <i class="icon miuu u-toys"></i>
                    <div class="name">toys</div>
                    <div class="fontclass">.u-toys</div>
                </li>
            
                <li>
                <i class="icon miuu u-auto"></i>
                    <div class="name">auto</div>
                    <div class="fontclass">.u-auto</div>
                </li>
            
                <li>
                <i class="icon miuu u-jewelry"></i>
                    <div class="name">jewelry</div>
                    <div class="fontclass">.u-jewelry</div>
                </li>
            
                <li>
                <i class="icon miuu u-trade-assurance"></i>
                    <div class="name">trade-assurance</div>
                    <div class="fontclass">.u-trade-assurance</div>
                </li>
            
                <li>
                <i class="icon miuu u-browse"></i>
                    <div class="name">browse</div>
                    <div class="fontclass">.u-browse</div>
                </li>
            
                <li>
                <i class="icon miuu u-rfqqm"></i>
                    <div class="name">rfq-qm</div>
                    <div class="fontclass">.u-rfqqm</div>
                </li>
            
                <li>
                <i class="icon miuu u-rfqquantity"></i>
                    <div class="name">rfq-quantity</div>
                    <div class="fontclass">.u-rfqquantity</div>
                </li>
            
                <li>
                <i class="icon miuu u-atmaway"></i>
                    <div class="name">atm-away</div>
                    <div class="fontclass">.u-atmaway</div>
                </li>
            
                <li>
                <i class="icon miuu u-rfq1"></i>
                    <div class="name">rfq</div>
                    <div class="fontclass">.u-rfq1</div>
                </li>
            
                <li>
                <i class="icon miuu u-scanning"></i>
                    <div class="name">scanning</div>
                    <div class="fontclass">.u-scanning</div>
                </li>
            
                <li>
                <i class="icon miuu u-compare"></i>
                    <div class="name">compare</div>
                    <div class="fontclass">.u-compare</div>
                </li>
            
                <li>
                <i class="icon miuu u-filter"></i>
                    <div class="name">filter</div>
                    <div class="fontclass">.u-filter</div>
                </li>
            
                <li>
                <i class="icon miuu u-pin"></i>
                    <div class="name">pin</div>
                    <div class="fontclass">.u-pin</div>
                </li>
            
                <li>
                <i class="icon miuu u-history"></i>
                    <div class="name">history</div>
                    <div class="fontclass">.u-history</div>
                </li>
            
                <li>
                <i class="icon miuu u-productfeatures"></i>
                    <div class="name">product-features</div>
                    <div class="fontclass">.u-productfeatures</div>
                </li>
            
                <li>
                <i class="icon miuu u-supplierfeatures"></i>
                    <div class="name">supplier-features</div>
                    <div class="fontclass">.u-supplierfeatures</div>
                </li>
            
                <li>
                <i class="icon miuu u-similarproduct"></i>
                    <div class="name">similar-product</div>
                    <div class="fontclass">.u-similarproduct</div>
                </li>
            
                <li>
                <i class="icon miuu u-link1"></i>
                    <div class="name">link</div>
                    <div class="fontclass">.u-link1</div>
                </li>
            
                <li>
                <i class="icon miuu u-cut"></i>
                    <div class="name">cut</div>
                    <div class="fontclass">.u-cut</div>
                </li>
            
                <li>
                <i class="icon miuu u-navlist"></i>
                    <div class="name">nav-list</div>
                    <div class="fontclass">.u-navlist</div>
                </li>
            
                <li>
                <i class="icon miuu u-imagetext"></i>
                    <div class="name">image-text</div>
                    <div class="fontclass">.u-imagetext</div>
                </li>
            
                <li>
                <i class="icon miuu u-text"></i>
                    <div class="name">text</div>
                    <div class="fontclass">.u-text</div>
                </li>
            
                <li>
                <i class="icon miuu u-move"></i>
                    <div class="name">move</div>
                    <div class="fontclass">.u-move</div>
                </li>
            
                <li>
                <i class="icon miuu u-subtract"></i>
                    <div class="name">subtract</div>
                    <div class="fontclass">.u-subtract</div>
                </li>
            
                <li>
                <i class="icon miuu u-dollar"></i>
                    <div class="name">dollar</div>
                    <div class="fontclass">.u-dollar</div>
                </li>
            
                <li>
                <i class="icon miuu u-selecticon"></i>
                    <div class="name">选择框_默认</div>
                    <div class="fontclass">.u-selecticon</div>
                </li>
            
                <li>
                <i class="icon miuu u-inputhover"></i>
                    <div class="name">输入_填充</div>
                    <div class="fontclass">.u-inputhover</div>
                </li>
            
                <li>
                <i class="icon miuu u-input"></i>
                    <div class="name">输入</div>
                    <div class="fontclass">.u-input</div>
                </li>
            
                <li>
                <i class="icon miuu u-downco"></i>
                    <div class="name">下箭头</div>
                    <div class="fontclass">.u-downco</div>
                </li>
            
                <li>
                <i class="icon miuu u-tips"></i>
                    <div class="name">一般提示</div>
                    <div class="fontclass">.u-tips</div>
                </li>
            
                <li>
                <i class="icon miuu u-eyes"></i>
                    <div class="name">眼睛</div>
                    <div class="fontclass">.u-eyes</div>
                </li>
            
                <li>
                <i class="icon miuu u-message"></i>
                    <div class="name">发送信息</div>
                    <div class="fontclass">.u-message</div>
                </li>
            
                <li>
                <i class="icon miuu u-edithover"></i>
                    <div class="name">文本编辑_填充</div>
                    <div class="fontclass">.u-edithover</div>
                </li>
            
                <li>
                <i class="icon miuu u-eidt"></i>
                    <div class="name">文本编辑</div>
                    <div class="fontclass">.u-eidt</div>
                </li>
            
                <li>
                <i class="icon miuu u-searchfei"></i>
                    <div class="name">查话费</div>
                    <div class="fontclass">.u-searchfei</div>
                </li>
            
                <li>
                <i class="icon miuu u-raw"></i>
                    <div class="name">raw</div>
                    <div class="fontclass">.u-raw</div>
                </li>
            
                <li>
                <i class="icon miuu u-office"></i>
                    <div class="name">office</div>
                    <div class="fontclass">.u-office</div>
                </li>
            
                <li>
                <i class="icon miuu u-agriculture"></i>
                    <div class="name">agriculture</div>
                    <div class="fontclass">.u-agriculture</div>
                </li>
            
                <li>
                <i class="icon miuu u-machinery"></i>
                    <div class="name">machinery</div>
                    <div class="fontclass">.u-machinery</div>
                </li>
            
                <li>
                <i class="icon miuu u-assessedbadge"></i>
                    <div class="name">assessed-Badge</div>
                    <div class="fontclass">.u-assessedbadge</div>
                </li>
            
                <li>
                <i class="icon miuu u-gerenzhongxin"></i>
                    <div class="name">personal-center</div>
                    <div class="fontclass">.u-gerenzhongxin</div>
                </li>
            
                <li>
                <i class="icon miuu u-jifen"></i>
                    <div class="name">integral</div>
                    <div class="fontclass">.u-jifen</div>
                </li>
            
                <li>
                <i class="icon miuu u-operation"></i>
                    <div class="name">operation</div>
                    <div class="fontclass">.u-operation</div>
                </li>
            
                <li>
                <i class="icon miuu u-remind1"></i>
                    <div class="name">remind</div>
                    <div class="fontclass">.u-remind1</div>
                </li>
            
                <li>
                <i class="icon miuu u-icondownload"></i>
                    <div class="name">download</div>
                    <div class="fontclass">.u-icondownload</div>
                </li>
            
                <li>
                <i class="icon miuu u-map"></i>
                    <div class="name">map</div>
                    <div class="fontclass">.u-map</div>
                </li>
            
                <li>
                <i class="icon miuu u-bad"></i>
                    <div class="name">bad</div>
                    <div class="fontclass">.u-bad</div>
                </li>
            
                <li>
                <i class="icon miuu u-good"></i>
                    <div class="name">good</div>
                    <div class="fontclass">.u-good</div>
                </li>
            
                <li>
                <i class="icon miuu u-skip"></i>
                    <div class="name">skip</div>
                    <div class="fontclass">.u-skip</div>
                </li>
            
                <li>
                <i class="icon miuu u-iconfontplay2"></i>
                    <div class="name">play</div>
                    <div class="fontclass">.u-iconfontplay2</div>
                </li>
            
                <li>
                <i class="icon miuu u-iconfontstop"></i>
                    <div class="name">stop</div>
                    <div class="fontclass">.u-iconfontstop</div>
                </li>
            
                <li>
                <i class="icon miuu u-compass"></i>
                    <div class="name">compass</div>
                    <div class="fontclass">.u-compass</div>
                </li>
            
                <li>
                <i class="icon miuu u-security"></i>
                    <div class="name">security</div>
                    <div class="fontclass">.u-security</div>
                </li>
            
                <li>
                <i class="icon miuu u-share1"></i>
                    <div class="name">share</div>
                    <div class="fontclass">.u-share1</div>
                </li>
            
                <li>
                <i class="icon miuu u-store"></i>
                    <div class="name">store</div>
                    <div class="fontclass">.u-store</div>
                </li>
            
                <li>
                <i class="icon miuu u-manageorder"></i>
                    <div class="name">manage-order</div>
                    <div class="fontclass">.u-manageorder</div>
                </li>
            
                <li>
                <i class="icon miuu u-rejectedorder"></i>
                    <div class="name">rejected-order</div>
                    <div class="fontclass">.u-rejectedorder</div>
                </li>
            
                <li>
                <i class="icon miuu u-phone"></i>
                    <div class="name">phone</div>
                    <div class="fontclass">.u-phone</div>
                </li>
            
                <li>
                <i class="icon miuu u-bussinessman"></i>
                    <div class="name">bussiness-man</div>
                    <div class="fontclass">.u-bussinessman</div>
                </li>
            
                <li>
                <i class="icon miuu u-shoes"></i>
                    <div class="name">shoes</div>
                    <div class="fontclass">.u-shoes</div>
                </li>
            
                <li>
                <i class="icon miuu u-mobilephone"></i>
                    <div class="name">Mobile-phone</div>
                    <div class="fontclass">.u-mobilephone</div>
                </li>
            
                <li>
                <i class="icon miuu u-emailfilling"></i>
                    <div class="name">email-filling</div>
                    <div class="fontclass">.u-emailfilling</div>
                </li>
            
                <li>
                <i class="icon miuu u-favoritesfilling"></i>
                    <div class="name">favorites-filling</div>
                    <div class="fontclass">.u-favoritesfilling</div>
                </li>
            
                <li>
                <i class="icon miuu u-accountfilling"></i>
                    <div class="name">account-filling</div>
                    <div class="fontclass">.u-accountfilling</div>
                </li>
            
                <li>
                <i class="icon miuu u-creditlevel"></i>
                    <div class="name">credit-level</div>
                    <div class="fontclass">.u-creditlevel</div>
                </li>
            
                <li>
                <i class="icon miuu u-creditlevelfilling"></i>
                    <div class="name">credit-level-filling</div>
                    <div class="fontclass">.u-creditlevelfilling</div>
                </li>
            
                <li>
                <i class="icon miuu u-seosearch"></i>
                    <div class="name">wxb搜索推广</div>
                    <div class="fontclass">.u-seosearch</div>
                </li>
            
                <li>
                <i class="icon miuu u-07jiantouxiangshang"></i>
                    <div class="name">07_箭头_向上</div>
                    <div class="fontclass">.u-07jiantouxiangshang</div>
                </li>
            
                <li>
                <i class="icon miuu u-07jiantouxiangxia"></i>
                    <div class="name">07_箭头_向下</div>
                    <div class="fontclass">.u-07jiantouxiangxia</div>
                </li>
            
                <li>
                <i class="icon miuu u-exl"></i>
                    <div class="name">exl</div>
                    <div class="fontclass">.u-exl</div>
                </li>
            
                <li>
                <i class="icon miuu u-pdf"></i>
                    <div class="name">pdf</div>
                    <div class="fontclass">.u-pdf</div>
                </li>
            
                <li>
                <i class="icon miuu u-zip"></i>
                    <div class="name">zip</div>
                    <div class="fontclass">.u-zip</div>
                </li>
            
                <li>
                <i class="icon miuu u-sorting"></i>
                    <div class="name">sorting</div>
                    <div class="fontclass">.u-sorting</div>
                </li>
            
                <li>
                <i class="icon miuu u-sousearch"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.u-sousearch</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiaoxizhongxin"></i>
                    <div class="name">消息中心</div>
                    <div class="fontclass">.u-xiaoxizhongxin</div>
                </li>
            
                <li>
                <i class="icon miuu u-rightco"></i>
                    <div class="name">翻页</div>
                    <div class="fontclass">.u-rightco</div>
                </li>
            
                <li>
                <i class="icon miuu u-leftco"></i>
                    <div class="name">翻页</div>
                    <div class="fontclass">.u-leftco</div>
                </li>
            
                <li>
                <i class="icon miuu u-copy"></i>
                    <div class="name">copy</div>
                    <div class="fontclass">.u-copy</div>
                </li>
            
                <li>
                <i class="icon miuu u-dianping"></i>
                    <div class="name">点评</div>
                    <div class="fontclass">.u-dianping</div>
                </li>
            
                <li>
                <i class="icon miuu u-shoucang"></i>
                    <div class="name">收藏</div>
                    <div class="fontclass">.u-shoucang</div>
                </li>
            
                <li>
                <i class="icon miuu u-24hours"></i>
                    <div class="name">24小时前台</div>
                    <div class="fontclass">.u-24hours</div>
                </li>
            
                <li>
                <i class="icon miuu u-search"></i>
                    <div class="name">搜索</div>
                    <div class="fontclass">.u-search</div>
                </li>
            
                <li>
                <i class="icon miuu u-share"></i>
                    <div class="name">分享</div>
                    <div class="fontclass">.u-share</div>
                </li>
            
                <li>
                <i class="icon miuu u-shouqi"></i>
                    <div class="name">收起</div>
                    <div class="fontclass">.u-shouqi</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiala"></i>
                    <div class="name">下拉</div>
                    <div class="fontclass">.u-xiala</div>
                </li>
            
                <li>
                <i class="icon miuu u-roundclose"></i>
                    <div class="name">round_close</div>
                    <div class="fontclass">.u-roundclose</div>
                </li>
            
                <li>
                <i class="icon miuu u-icons"></i>
                    <div class="name">icons</div>
                    <div class="fontclass">.u-icons</div>
                </li>
            
                <li>
                <i class="icon miuu u-save"></i>
                    <div class="name">save</div>
                    <div class="fontclass">.u-save</div>
                </li>
            
                <li>
                <i class="icon miuu u-inquirytemplate"></i>
                    <div class="name"> inquiry-template</div>
                    <div class="fontclass">.u-inquirytemplate</div>
                </li>
            
                <li>
                <i class="icon miuu u-templatedefault"></i>
                    <div class="name">template-default</div>
                    <div class="fontclass">.u-templatedefault</div>
                </li>
            
                <li>
                <i class="icon miuu u-libra"></i>
                    <div class="name">libra</div>
                    <div class="fontclass">.u-libra</div>
                </li>
            
                <li>
                <i class="icon miuu u-survey1"></i>
                    <div class="name">survey</div>
                    <div class="fontclass">.u-survey1</div>
                </li>
            
                <li>
                <i class="icon miuu u-ship"></i>
                    <div class="name">ship</div>
                    <div class="fontclass">.u-ship</div>
                </li>
            
                <li>
                <i class="icon miuu u-wenjianjia"></i>
                    <div class="name">文件夹</div>
                    <div class="fontclass">.u-wenjianjia</div>
                </li>
            
                <li>
                <i class="icon miuu u-bussinesscard"></i>
                    <div class="name">bussiness-card</div>
                    <div class="fontclass">.u-bussinesscard</div>
                </li>
            
                <li>
                <i class="icon miuu u-hot"></i>
                    <div class="name">hot</div>
                    <div class="fontclass">.u-hot</div>
                </li>
            
                <li>
                <i class="icon miuu u-data"></i>
                    <div class="name">data</div>
                    <div class="fontclass">.u-data</div>
                </li>
            
                <li>
                <i class="icon miuu u-trade"></i>
                    <div class="name">trade</div>
                    <div class="fontclass">.u-trade</div>
                </li>
            
                <li>
                <i class="icon miuu u-onepage48"></i>
                    <div class="name">onepage</div>
                    <div class="fontclass">.u-onepage48</div>
                </li>
            
                <li>
                <i class="icon miuu u-link"></i>
                    <div class="name">链接</div>
                    <div class="fontclass">.u-link</div>
                </li>
            
                <li>
                <i class="icon miuu u-signboard"></i>
                    <div class="name">signboard</div>
                    <div class="fontclass">.u-signboard</div>
                </li>
            
                <li>
                <i class="icon miuu u-shuffling-banner"></i>
                    <div class="name">shuffling-banner</div>
                    <div class="fontclass">.u-shuffling-banner</div>
                </li>
            
                <li>
                <i class="icon miuu u-component"></i>
                    <div class="name">component</div>
                    <div class="fontclass">.u-component</div>
                </li>
            
                <li>
                <i class="icon miuu u-component-filling"></i>
                    <div class="name">component-filling</div>
                    <div class="fontclass">.u-component-filling</div>
                </li>
            
                <li>
                <i class="icon miuu u-color"></i>
                    <div class="name">color</div>
                    <div class="fontclass">.u-color</div>
                </li>
            
                <li>
                <i class="icon miuu u-color-filling"></i>
                    <div class="name">color-filling</div>
                    <div class="fontclass">.u-color-filling</div>
                </li>
            
                <li>
                <i class="icon miuu u-favorites"></i>
                    <div class="name">favorites</div>
                    <div class="fontclass">.u-favorites</div>
                </li>
            
                <li>
                <i class="icon miuu u-pic-filling"></i>
                    <div class="name">pic-filling</div>
                    <div class="fontclass">.u-pic-filling</div>
                </li>
            
                <li>
                <i class="icon miuu u-RFQ"></i>
                    <div class="name">RFQ</div>
                    <div class="fontclass">.u-RFQ</div>
                </li>
            
                <li>
                <i class="icon miuu u-RFQ-filling"></i>
                    <div class="name">RFQ-filling</div>
                    <div class="fontclass">.u-RFQ-filling</div>
                </li>
            
                <li>
                <i class="icon miuu u-originalimage"></i>
                    <div class="name">original-image</div>
                    <div class="fontclass">.u-originalimage</div>
                </li>
            
                <li>
                <i class="icon miuu u-logistic"></i>
                    <div class="name">logistic</div>
                    <div class="fontclass">.u-logistic</div>
                </li>
            
                <li>
                <i class="icon miuu u-Calculator"></i>
                    <div class="name">Calculator</div>
                    <div class="fontclass">.u-Calculator</div>
                </li>
            
                <li>
                <i class="icon miuu u-laba-xianxing"></i>
                    <div class="name">212喇叭-线性</div>
                    <div class="fontclass">.u-laba-xianxing</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiangxiazhankai-xianxingyuankuang"></i>
                    <div class="name">310向下、展开-线性圆框</div>
                    <div class="fontclass">.u-xiangxiazhankai-xianxingyuankuang</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiangxiazhankai-yuankuang"></i>
                    <div class="name">310向下、展开-圆框</div>
                    <div class="fontclass">.u-xiangxiazhankai-yuankuang</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiangshangshouqi-yuankuang"></i>
                    <div class="name">311向上、收起-圆框</div>
                    <div class="fontclass">.u-xiangshangshouqi-yuankuang</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiangshangshouqi-xianxingyuankuang"></i>
                    <div class="name">311向上、收起-线性圆框</div>
                    <div class="fontclass">.u-xiangshangshouqi-xianxingyuankuang</div>
                </li>
            
                <li>
                <i class="icon miuu u-video"></i>
                    <div class="name">video</div>
                    <div class="fontclass">.u-video</div>
                </li>
            
                <li>
                <i class="icon miuu u-earth"></i>
                    <div class="name">earth</div>
                    <div class="fontclass">.u-earth</div>
                </li>
            
                <li>
                <i class="icon miuu u-task-management"></i>
                    <div class="name">task-management</div>
                    <div class="fontclass">.u-task-management</div>
                </li>
            
                <li>
                <i class="icon miuu u-trust"></i>
                    <div class="name">trust</div>
                    <div class="fontclass">.u-trust</div>
                </li>
            
                <li>
                <i class="icon miuu u-xiaoxi"></i>
                    <div class="name"> 消息</div>
                    <div class="fontclass">.u-xiaoxi</div>
                </li>
            
                <li>
                <i class="icon miuu u-kuaitui"></i>
                    <div class="name">快退</div>
                    <div class="fontclass">.u-kuaitui</div>
                </li>
            
                <li>
                <i class="icon miuu u-kuaijin"></i>
                    <div class="name">快进</div>
                    <div class="fontclass">.u-kuaijin</div>
                </li>
            
                <li>
                <i class="icon miuu u-youji"></i>
                    <div class="name">游记</div>
                    <div class="fontclass">.u-youji</div>
                </li>
            
                <li>
                <i class="icon miuu u-shaixuan"></i>
                    <div class="name">筛选3</div>
                    <div class="fontclass">.u-shaixuan</div>
                </li>
            
                <li>
                <i class="icon miuu u-lishihangcheng"></i>
                    <div class="name">历史行程</div>
                    <div class="fontclass">.u-lishihangcheng</div>
                </li>
            
                <li>
                <i class="icon miuu u-password"></i>
                    <div class="name">password</div>
                    <div class="fontclass">.u-password</div>
                </li>
            
                <li>
                <i class="icon miuu u-column"></i>
                    <div class="name">3column</div>
                    <div class="fontclass">.u-column</div>
                </li>
            
                <li>
                <i class="icon miuu u-apparel"></i>
                    <div class="name">apparel</div>
                    <div class="fontclass">.u-apparel</div>
                </li>
            
                <li>
                <i class="icon miuu u-bags"></i>
                    <div class="name">bags</div>
                    <div class="fontclass">.u-bags</div>
                </li>
            
                <li>
                <i class="icon miuu u-folder"></i>
                    <div class="name">folder</div>
                    <div class="fontclass">.u-folder</div>
                </li>
            
                <li>
                <i class="icon miuu u-column1"></i>
                    <div class="name">4column</div>
                    <div class="fontclass">.u-column1</div>
                </li>
            
                <li>
                <i class="icon miuu u-code"></i>
                    <div class="name">code</div>
                    <div class="fontclass">.u-code</div>
                </li>
            
                <li>
                <i class="icon miuu u-RFQ-filling1"></i>
                    <div class="name">RFQ-filling</div>
                    <div class="fontclass">.u-RFQ-filling1</div>
                </li>
            
                <li>
                <i class="icon miuu u-customs-clearance"></i>
                    <div class="name">customs-clearance</div>
                    <div class="fontclass">.u-customs-clearance</div>
                </li>
            
                <li>
                <i class="icon miuu u-good-filling"></i>
                    <div class="name">good-filling</div>
                    <div class="fontclass">.u-good-filling</div>
                </li>
            
                <li>
                <i class="icon miuu u-camera"></i>
                    <div class="name">camera</div>
                    <div class="fontclass">.u-camera</div>
                </li>
            
        </ul>

        <h2 id="font-class-">font-class引用</h2>
        <hr>

        <p>font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。</p>
        <p>与unicode使用方式相比，具有如下特点：</p>
        <ul>
        <li>兼容性良好，支持ie8+，及所有现代浏览器。</li>
        <li>相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。</li>
        <li>因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。</li>
        <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
        </ul>
        <p>使用步骤如下：</p>
        <h3 id="-fontclass-">第一步：引入项目下面生成的fontclass代码：</h3>


        <pre><code class="lang-js hljs javascript"><span class="hljs-comment">&lt;link rel="stylesheet" type="text/css" href="./iconfont.css"&gt;</span></code></pre>
        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
        <pre><code class="lang-css hljs">&lt;<span class="hljs-selector-tag">i</span> <span class="hljs-selector-tag">class</span>="<span class="hljs-selector-tag">miuu</span> <span class="hljs-selector-tag">u-xxx</span>"&gt;&lt;/<span class="hljs-selector-tag">i</span>&gt;</code></pre>
        <blockquote>
        <p>"miuu"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。</p>
        </blockquote>
    </div>
</body>
</html>
